<!DOCTYPE html>
<html>
<head lang="en">
  <meta charset="UTF-8">
  <title></title>
</head>
<body ng-app="" ng-init="age=12">
<!--
1. 作用域对象     :
  * 一个js实例对象, ng-app指令默认会创建一个根作用域对象($rootScope)
  * 它的属性和方法与页面中的指令或表达式是关联的
2. 控制器:
  * 用来控制AngularJS应用数据的 实例对象
  * ng-controller : 指定控制器构造函数, Angular会自动new此函数创建控制器对象
  * 同时Angular还有创建一个新的域对象$scope, 它是$rootScope的子对象
  * 在控制器函数中声明$scope形参, Angular会自动将$scope传入
-->
<div ng-controller="MyController">
  <input type="text" placeholder="姓" ng-model="firstName">
  <input type="text" placeholder="名" ng-model="lastName">

  <p>输入的姓名为: {{firstName+'-'+lastName}}</p>
  <p>输入的姓名2为: {{getName()}}</p>
</div>

<div>
  {{firstName}} <!--不能显示-->
</div>

<script type="text/javascript" src="../../js/angular-1.2.29/angular.js"></script>
<script type="text/javascript">
  function MyController ($scope) {//必须是$scope
    // alert(this instanceof MyController);//说明是new调用
    $scope.firstName = 'KB';
    $scope.lastName = 'Brent';

    //给域对象指定方法
    $scope.getName = function() {
      return $scope.firstName + "  " + $scope.lastName;
    };

    console.log($scope.age);
  }
</script>
</body>
</html>